.toolbar__btn {
   cursor: pointer;
   border-radius: 1.2rem;
   font-size: 2.2rem;
   display: flex;
   gap: 1rem;
   align-items: center;
   padding: 1.2rem;
   border: none;
   color: var(--text-primary);
   position: relative;
   transition: all 0.3s ease;

   &:not(.disabled):hover {
      background: var(--bg-secondary);
   }

   &:active > svg {
      transform: scale(0.8);
      transition: transform 0.3s ease;
   }

   &.disabled {
      cursor: not-allowed;
      color: var(--color-disabled);
   }

   &.inactive {
      color: var(--color-disabled);
   }

   &.delete {
      color: var(--red);
   }

   .shortcut {
      font-size: 12px;
      background-color: var(--bg-secondary);
      padding: 0.5rem;
      border-radius: 0.5rem;
      margin-right: -0.5rem;
      color: var(--text-primary);
   }

   .active {
      position: absolute;
      right: .5rem;
      top: .5rem;
      height: 5px;
      width: 5px;
      border-radius: 50%;
      background: var(--color-primary);
   }
}